<!DOCTYPE html>
<html lang="en-US" dir="ltr">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1">
    <title>zijid-ui</title>
    <meta name="description" content="一个ui库">
    <meta name="generator" content="VitePress v1.3.4">
    <link rel="preload stylesheet" href="/zijid-ui-dome/assets/style.DOtj9TfK.css" as="style">
    
    <script type="module" src="/zijid-ui-dome/assets/app.C86koO5X.js"></script>
    <link rel="preload" href="/zijid-ui-dome/assets/inter-roman-latin.Di8DUHzh.woff2" as="font" type="font/woff2" crossorigin="">
    <link rel="modulepreload" href="/zijid-ui-dome/assets/chunks/theme.JeDqD2vs.js">
    <link rel="modulepreload" href="/zijid-ui-dome/assets/chunks/framework.CxxP_cWD.js">
    <link rel="modulepreload" href="/zijid-ui-dome/assets/chunks/main.zuvFqedf.js">
    <link rel="modulepreload" href="/zijid-ui-dome/assets/api.md.BDPD28x_.lean.js">
    <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
    <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
  </head>
  <body>
    <div id="app"><div class="Layout" data-v-48d697d2><!--[--><!--]--><!--[--><span tabindex="-1" data-v-f3b4a1fb></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-f3b4a1fb> Skip to content </a><!--]--><!----><header class="VPNav" data-v-48d697d2 data-v-03d91078><div class="VPNavBar top" data-v-03d91078 data-v-e6287f11><div class="wrapper" data-v-e6287f11><div class="container" data-v-e6287f11><div class="title" data-v-e6287f11><div class="VPNavBarTitle" data-v-e6287f11 data-v-6884be3c><a class="title" href="/zijid-ui-dome/" data-v-6884be3c><!--[--><!--]--><!----><span data-v-6884be3c>zijid-ui</span><!--[--><!--]--></a></div></div><div class="content" data-v-e6287f11><div class="content-body" data-v-e6287f11><!--[--><!--]--><div class="VPNavBarSearch search" data-v-e6287f11><!----></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-e6287f11 data-v-38307ea2><span id="main-nav-aria-label" class="visually-hidden" data-v-38307ea2> Main Navigation </span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/zijid-ui-dome/" tabindex="0" data-v-38307ea2 data-v-fcd34053><!--[--><span data-v-fcd34053>首页</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink active" href="/zijid-ui-dome/api.html" tabindex="0" data-v-38307ea2 data-v-fcd34053><!--[--><span data-v-fcd34053>例子</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-e6287f11 data-v-2b315d88><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="Switch to dark theme" aria-checked="false" data-v-2b315d88 data-v-59308932 data-v-b3f01bc2><span class="check" data-v-b3f01bc2><span class="icon" data-v-b3f01bc2><!--[--><span class="vpi-sun sun" data-v-59308932></span><span class="vpi-moon moon" data-v-59308932></span><!--]--></span></span></button></div><div class="VPSocialLinks VPNavBarSocialLinks social-links" data-v-e6287f11 data-v-5f8a1221 data-v-8d618a9b><!--[--><a class="VPSocialLink no-icon" href="https://github.com/zijid/zijid-ui-dome" aria-label="github" target="_blank" rel="noopener" data-v-8d618a9b data-v-ef2fbf59><span class="vpi-social-github" /></a><!--]--></div><div class="VPFlyout VPNavBarExtra extra" data-v-e6287f11 data-v-07cc11ae data-v-1c0c0e0d><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-1c0c0e0d><span class="vpi-more-horizontal icon" data-v-1c0c0e0d></span></button><div class="menu" data-v-1c0c0e0d><div class="VPMenu" data-v-1c0c0e0d data-v-928c94c4><!----><!--[--><!--[--><!----><div class="group" data-v-07cc11ae><div class="item appearance" data-v-07cc11ae><p class="label" data-v-07cc11ae>Appearance</p><div class="appearance-action" data-v-07cc11ae><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="Switch to dark theme" aria-checked="false" data-v-07cc11ae data-v-59308932 data-v-b3f01bc2><span class="check" data-v-b3f01bc2><span class="icon" data-v-b3f01bc2><!--[--><span class="vpi-sun sun" data-v-59308932></span><span class="vpi-moon moon" data-v-59308932></span><!--]--></span></span></button></div></div></div><div class="group" data-v-07cc11ae><div class="item social-links" data-v-07cc11ae><div class="VPSocialLinks social-links-list" data-v-07cc11ae data-v-8d618a9b><!--[--><a class="VPSocialLink no-icon" href="https://github.com/zijid/zijid-ui-dome" aria-label="github" target="_blank" rel="noopener" data-v-8d618a9b data-v-ef2fbf59><span class="vpi-social-github" /></a><!--]--></div></div></div><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-e6287f11 data-v-d19adcad><span class="container" data-v-d19adcad><span class="top" data-v-d19adcad></span><span class="middle" data-v-d19adcad></span><span class="bottom" data-v-d19adcad></span></span></button></div></div></div></div><div class="divider" data-v-e6287f11><div class="divider-line" data-v-e6287f11></div></div></div><!----></header><div class="VPLocalNav empty fixed" data-v-48d697d2 data-v-999ff4fa><div class="container" data-v-999ff4fa><!----><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-999ff4fa data-v-a6375011><button data-v-a6375011>Return to top</button><!----></div></div></div><!----><div class="VPContent" id="VPContent" data-v-48d697d2 data-v-6c0a65ee><div class="VPDoc has-aside" data-v-6c0a65ee data-v-ac6aa90b><!--[--><!--]--><div class="container" data-v-ac6aa90b><div class="aside" data-v-ac6aa90b><div class="aside-curtain" data-v-ac6aa90b></div><div class="aside-container" data-v-ac6aa90b><div class="aside-content" data-v-ac6aa90b><div class="VPDocAside" data-v-ac6aa90b data-v-6274331c><!--[--><!--]--><!--[--><!--]--><nav aria-labelledby="doc-outline-aria-label" class="VPDocAsideOutline" data-v-6274331c data-v-7d4b08bf><div class="content" data-v-7d4b08bf><div class="outline-marker" data-v-7d4b08bf></div><div aria-level="2" class="outline-title" id="doc-outline-aria-label" role="heading" data-v-7d4b08bf>On this page</div><ul class="VPDocOutlineItem root" data-v-7d4b08bf data-v-67145188><!--[--><!--]--></ul></div></nav><!--[--><!--]--><div class="spacer" data-v-6274331c></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-ac6aa90b><div class="content-container" data-v-ac6aa90b><!--[--><!--]--><main class="main" data-v-ac6aa90b><div style="position:relative;" class="vp-doc _zijid-ui-dome_api" data-v-ac6aa90b><div><h1 id="zijid-ui" tabindex="-1">zijid-ui <a class="header-anchor" href="#zijid-ui" aria-label="Permalink to &quot;zijid-ui&quot;">​</a></h1><p>这里展示了 zijid-ui 的组件和一些方法 ！！！贼垃圾的库 库和源文档应该更新过 对不上了 等以后想写再重写吧</p><h2 id="开始使用" tabindex="-1">开始使用 <a class="header-anchor" href="#开始使用" aria-label="Permalink to &quot;开始使用&quot;">​</a></h2><div class="language-cmd vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">cmd</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">npm i zijid</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">-</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">ui</span></span></code></pre></div><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">import</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> z, { Message } </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">from</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &quot;zijid-ui&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">import</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> App </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">from</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &quot;./App.vue&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> app</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> =</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> createApp</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(App);</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">app.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">use</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(z);</span></span></code></pre></div><h2 id="仿-vscode-目录" tabindex="-1">仿 vscode 目录 <a class="header-anchor" href="#仿-vscode-目录" aria-label="Permalink to &quot;仿 vscode 目录&quot;">​</a></h2><div class="language-vue vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">vue</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">zi-dir</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> @</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">open</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">openDir</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> :</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">data</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">dirData1</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">zi-dir</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span></code></pre></div><div style="height:200px;line-height:1em;"><!----></div><h2 id="菜单" tabindex="-1">菜单 <a class="header-anchor" href="#菜单" aria-label="Permalink to &quot;菜单&quot;">​</a></h2><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> dirData1</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> =</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> [</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">	{</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">		title: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;文件夹&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">		children: [</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">			{</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">				isGroup: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">true</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">				title: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;文件222&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">				data: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;文件222&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">				handle</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">: </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">function</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> (</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">title</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">children</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">) {</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">					console.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">log</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;title:&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, title);</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">				},</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">			},</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">		],</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">		handle</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">: </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">function</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> (</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">title</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">children</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">) {</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">			console.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">log</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;title:&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, title);</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">		},</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">	},</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">	{</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">		title: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;空文件夹&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">		children: [],</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">		handle</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">: </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">function</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> (</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">title</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">children</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">) {</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">			console.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">log</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;title:&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, title);</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">		},</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">	},</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">	{</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">		isGroup: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">true</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">		title: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;文件1&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">		data: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;文件1&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">		handle</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">: </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">function</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> (</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">title</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">children</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">) {</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">			console.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">log</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;title:&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, title);</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">		},</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">	},</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">	{</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">		isGroup: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">true</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">		title: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;文件2&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">		data: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;文件2&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">		handle</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">: </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">function</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> (</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">title</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, </span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">children</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">) {</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">			console.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">log</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;title:&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, title);</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">		},</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">	},</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">];</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">const</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> openDir</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> =</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> (</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">e</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">) </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=&gt;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> {</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">	Message?.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">succeed</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;打开了:&quot;</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> +</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> e);</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">};</span></span></code></pre></div><div class="language-vue vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">vue</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">zi-dir</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> @</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">open</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">openDir</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> :</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">data</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">dirData1</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">zi-dir</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span></code></pre></div><div style="height:300px;line-height:2em;"><!----></div><h2 id="zijid-ui-图标库" tabindex="-1">zijid-ui 图标库 <a class="header-anchor" href="#zijid-ui-图标库" aria-label="Permalink to &quot;zijid-ui 图标库&quot;">​</a></h2><p>感觉没什么用 就仿着做</p><div class="language-vue vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">vue</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">zi-icon</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> color</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;#000&quot;</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> name</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;edit&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">zi-icon</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">i</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;zijid-ui zj-3column&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">i</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">i</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;zijid-ui zj-bottom&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">i</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">i</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;zijid-ui zj-export&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">i</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span></code></pre></div><!--[--><div data-v-ea4937a9><h1 data-v-ea4937a9>zijid-ui 图标库</h1><h3 data-v-ea4937a9>使用方法</h3><code class="code" data-v-ea4937a9>&lt;zi-icon color=&quot;#000&quot; name=&quot;edit&quot;&gt;&lt;/zi-icon&gt;
				&lt;i class=&quot;zijid-ui zj-3column&quot;&gt;&lt;/i&gt;
				&lt;i class=&quot;zijid-ui zj-bottom&quot;&gt;&lt;/i&gt;
				&lt;i class=&quot;zijid-ui zj-export&quot;&gt;&lt;/i&gt;
			</code></div><div class="icon-box" data-v-ea4937a9><!--[--><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><div class="icon-box-border" data-v-ea4937a9><div class="mask" data-v-ea4937a9><span data-v-ea4937a9>复制i</span><span data-v-ea4937a9>复制组件</span><span data-v-ea4937a9>复制类名</span></div><!----></div><!--]--></div><!--]--><h2 id="加载动画" tabindex="-1">加载动画 <a class="header-anchor" href="#加载动画" aria-label="Permalink to &quot;加载动画&quot;">​</a></h2><div class="language-vue vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">vue</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">zi-loading</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">	fixed</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">	:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">isLoading</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">true</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">	@</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">click</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">Message.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">warn</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&#39;1&#39;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">)</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">	:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">fixed</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">false</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">zi-loading</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span></code></pre></div><h1 id="loading">加载动画</h1><button style="padding:10px;background-color:rgb(0, 81, 255);color:#fff;border:0;">显示</button><!----><h2 id="按钮" tabindex="-1">按钮 <a class="header-anchor" href="#按钮" aria-label="Permalink to &quot;按钮&quot;">​</a></h2><p>按钮类型 default|affirm|delete<br> 按钮背景变淡 plain<br> 圆角 round<br> 变淡加圆角 round</p><div class="language-vue vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">vue</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">zi-button</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> type</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;delete&quot;</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> plain</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> round</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;删除按钮&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">zi-button</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span></code></pre></div><h2 id="提示信息" tabindex="-1">提示信息 <a class="header-anchor" href="#提示信息" aria-label="Permalink to &quot;提示信息&quot;">​</a></h2><p>按钮类型 default|affirm|delete<br> 按钮背景变淡 plain<br> 圆角 round<br> 变淡加圆角 round</p><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">import</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> {Message} </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">from</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &quot;@/components/message/index.js&quot;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">console.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">log</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;Message:&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,Message);</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">Message.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">succeed</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;succeed&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">)</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">Message.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">info</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;info&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">)</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">Message.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">error</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;error&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">)</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">Message.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">warn</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;warn&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">)</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">Message</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">({</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">	title:</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;ssssssss&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">	type:</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;info&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">	close:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">false</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">	time:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">4000</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">});</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">Message</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">({</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">	title:</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;&lt;h1&gt;h1&lt;/h1&gt;&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">//内容</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">	html:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">true</span><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">//使用html</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">	type:</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;info&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">//类型</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">	close:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">false</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,</span><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">//是否可关闭</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">	time:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">4000</span><span style="--shiki-light:#6A737D;--shiki-dark:#6A737D;">//自动关闭时间</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">});</span></span></code></pre></div><h1 id="button">按钮</h1><div>按钮类型 default|affirm|delete</div><!----><!----><!----><br><div>按钮背景变淡 plain</div><!----><!----><!----><br><div>圆角round</div><!----><!----><!----><br><div>变淡加圆角round</div><!----><!----><!----><br><h2 id="头部" tabindex="-1">头部 <a class="header-anchor" href="#头部" aria-label="Permalink to &quot;头部&quot;">​</a></h2><div class="language-vue vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">vue</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">zi-header</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">	&lt;template #logo&gt;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">		&lt;div&gt;logo&lt;/div&gt;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">	&lt;/template&gt;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">	&lt;template #default&gt;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">	&lt;zi-zoom v-slot=&quot;scope&quot;&gt;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">		&lt;div :class=&quot;scope.class&quot;&gt;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">			&lt;div&gt;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">				首页</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">			&lt;/div&gt;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">			&lt;div&gt;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">				我的</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">			&lt;/div&gt;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">			&lt;div&gt;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">				作品</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">			&lt;/div&gt;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">			&lt;div&gt;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">				资讯</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">			&lt;/div&gt;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">			&lt;div&gt;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">				关于本站</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">			&lt;/div&gt;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">		&lt;/div&gt;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">	&lt;/zi-zoom&gt;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">	&lt;/template&gt;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">zi-header</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span></code></pre></div><div class="language- vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang"></span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span>&lt;div style=&quot;height: 100px;&quot;&gt;</span></span>
<span class="line"><span>&lt;zi-header&gt;</span></span>
<span class="line"><span>&lt;template #logo&gt;</span></span>
<span class="line"><span>&lt;div&gt;logo&lt;/div&gt;</span></span>
<span class="line"><span>&lt;/template&gt;</span></span>
<span class="line"><span>&lt;template #default&gt;</span></span>
<span class="line"><span></span></span>
<span class="line"><span>&lt;zi-zoom v-slot=&quot;scope&quot; offset=&quot;calc(-1em + -16px)&quot;&gt;</span></span>
<span class="line"><span>&lt;!-- noZoom=&quot;con&quot; zoom=&quot;conNo&quot; --&gt;</span></span>
<span class="line"><span>&lt;div :class=&quot;scope.class&quot;&gt;</span></span>
<span class="line"><span>&lt;div&gt;</span></span>
<span class="line"><span>首页</span></span>
<span class="line"><span>&lt;/div&gt;</span></span>
<span class="line"><span>&lt;div&gt;</span></span>
<span class="line"><span>我的</span></span>
<span class="line"><span>&lt;/div&gt;</span></span>
<span class="line"><span>&lt;div&gt;</span></span>
<span class="line"><span>作品</span></span>
<span class="line"><span>&lt;/div&gt;</span></span>
<span class="line"><span>&lt;div&gt;</span></span>
<span class="line"><span>资讯</span></span>
<span class="line"><span>&lt;/div&gt;</span></span>
<span class="line"><span>&lt;div&gt;</span></span>
<span class="line"><span>关于本站</span></span>
<span class="line"><span>&lt;/div&gt;</span></span>
<span class="line"><span>&lt;/div&gt;</span></span>
<span class="line"><span>&lt;/zi-zoom&gt;</span></span>
<span class="line"><span>&lt;/template&gt;</span></span>
<span class="line"><span>&lt;/zi-header&gt;</span></span>
<span class="line"><span>&lt;/div&gt;</span></span></code></pre></div><h2 id="缩放" tabindex="-1">缩放 <a class="header-anchor" href="#缩放" aria-label="Permalink to &quot;缩放&quot;">​</a></h2><div class="language-vue vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">vue</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">zi-zoom</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> v-slot</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">scope</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">	&lt;div :class=&quot;scope.class&quot;&gt;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">		&lt;div&gt;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">			首页</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">		&lt;/div&gt;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">		&lt;div&gt;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">			我的</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">		&lt;/div&gt;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">		&lt;div&gt;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">			作品</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">		&lt;/div&gt;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">		&lt;div&gt;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">			资讯</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">		&lt;/div&gt;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">		&lt;div&gt;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">			关于本站</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">		&lt;/div&gt;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">	&lt;/div&gt;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&lt;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D;">zi-zoom</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">&gt;</span></span></code></pre></div><div class="language- vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang"></span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span>&lt;div style=&quot;height: 100px;&quot; &gt;</span></span>
<span class="line"><span>	&lt;zi-zoom v-slot=&quot;scope&quot; offset=&quot;-16px&quot;&gt;</span></span>
<span class="line"><span>	&lt;!-- noZoom=&quot;con&quot; zoom=&quot;conNo&quot; --&gt;</span></span>
<span class="line"><span>		&lt;div :class=&quot;scope.class&quot;&gt;</span></span>
<span class="line"><span>			&lt;div&gt;</span></span>
<span class="line"><span>			首页</span></span>
<span class="line"><span>			&lt;/div&gt;</span></span>
<span class="line"><span>			&lt;div&gt;</span></span>
<span class="line"><span>			我的</span></span>
<span class="line"><span>			&lt;/div&gt;</span></span>
<span class="line"><span>			&lt;div&gt;</span></span>
<span class="line"><span>			作品</span></span>
<span class="line"><span>			&lt;/div&gt;</span></span>
<span class="line"><span>			&lt;div&gt;</span></span>
<span class="line"><span>			资讯</span></span>
<span class="line"><span>			&lt;/div&gt;</span></span>
<span class="line"><span>			&lt;div&gt;</span></span>
<span class="line"><span>			关于本站</span></span>
<span class="line"><span>			&lt;/div&gt;</span></span>
<span class="line"><span>		&lt;/div&gt;</span></span>
<span class="line"><span>	&lt;/zi-zoom&gt;</span></span>
<span class="line"><span>&lt;/div&gt;</span></span></code></pre></div><h2 id="indexeddb-数据库" tabindex="-1">indexedDB 数据库 <a class="header-anchor" href="#indexeddb-数据库" aria-label="Permalink to &quot;indexedDB 数据库&quot;">​</a></h2><p>操作数据库<br> new IndexedDB(表名)</p><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">function</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> createDB</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(){</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">	window?.aaa</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">db.value</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=new</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> IndexedDB</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(dbName.value)</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">	console.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">log</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">`db.value:`</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">,db.value);</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">	Message</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">`数据库连接，数据库名称:${</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">db</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">.</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">value</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">.</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">name</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">}`</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">)</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">}</span></span></code></pre></div><p>db.createTable(表名,主键配置,索引配置数组)</p><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">async</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> function</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> createTableAndKey</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">() {</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">	const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> config</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> =</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> { </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">...</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">dbConfig };</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">	if</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> (noKey.value) {</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">		delete</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> config.keyPath;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">	}</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">	if</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> ((</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">await</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> db.value.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">isCreate</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(tableName.value)) </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">===</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> false</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">) {</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">		await</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> db.value.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">createTable</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(tableName.value, config, keyList);</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">		Message</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">`创建表:undefined，配置:{&quot;keyPath&quot;:&quot;f&quot;,&quot;autoIncrement&quot;:false}`</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">);</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">	} </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">else</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> {</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">		Message.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">error</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;表已存在&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">);</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">	}</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">}</span></span></code></pre></div><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">async</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> function</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> createKey</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">() {</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">	if</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> (</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">!</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">db.value) {</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">		Message.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">error</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;先连接数据库&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">);</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">		return</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">	}</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">	let</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> createIndexState </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> await</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> db.value.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">createIndex</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(tableName.value, keyList);</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">	console.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">log</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">`createIndexState:`</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">, createIndexState);</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">}</span></span></code></pre></div><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">async</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> function</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> createTable</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">() {</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">	const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> config</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> =</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> { </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">...</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">dbConfig };</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">	if</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> (noKey.value) {</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">		delete</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> config.keyPath;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">	}</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">	if</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> ((</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">await</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> db.value.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">isCreate</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(tableName.value)) </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">===</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> false</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">) {</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">		await</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> db.value.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">createTable</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(tableName.value, config);</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">		Message</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">`创建表:${</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">tableName</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">.</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">value</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">}，配置:${</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;">JSON</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">stringify</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">(</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">dbConfig</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">)</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">}`</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">);</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">	} </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">else</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> {</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">		Message.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">error</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">&quot;表已存在&quot;</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">);</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">	}</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">}</span></span></code></pre></div><p>db.add(表名,数据,主键(主键可以放这里也可以放数据的属性里),是否更新(默认 false))</p><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">async</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> function</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> addData</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">() {</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">	let</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> json;</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">	try</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> {</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">		json </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> JSON</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">parse</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(data.value);</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">	} </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">catch</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> (err) {</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">		json </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> data.value;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">	}</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">	await</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> db.value.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;">add</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">(tableName.value, json, keyData.value);</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">}</span></span></code></pre></div></div></div></main><footer class="VPDocFooter" data-v-ac6aa90b data-v-893cefb4><!--[--><!--]--><!----><!----></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><!----><!--[--><!--]--></div></div>
    <script>window.__VP_HASH_MAP__=JSON.parse("{\"api-examples.md\":\"pGmBhD3U\",\"api.md\":\"BDPD28x_\",\"index.md\":\"0qXMMRfU\",\"readme.md\":\"Bty953XS\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"zijid-ui\",\"description\":\"一个ui库\",\"base\":\"/zijid-ui-dome/\",\"head\":[],\"router\":{\"prefetchLinks\":true},\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"首页\",\"link\":\"/\"},{\"text\":\"例子\",\"link\":\"/api\"}],\"sidebar\":[],\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/zijid/zijid-ui-dome\"}]},\"locales\":{},\"scrollOffset\":134,\"cleanUrls\":false}");</script>
    
  </body>
</html>